import vue from 'vue' // 导入Vue
import Vuex from 'vuex' // 导入Vuex
import router, {resetRouter} from "../router"; // 导入router和resetRouter函数

vue.use(Vuex) // 使用Vuex插件

function addNewRoute(menuList) { // 定义一个函数，用于添加新的路由
    console.log(menuList) // 打印menuList
    let routes = router.options.routes // 获取router配置中的routes
    console.log(routes) // 打印routes
    routes.forEach(routeItem => { // 遍历routes
        if(routeItem.path == "/Index"){ // 如果找到路径为/Index的路由
            menuList.forEach(menu => { // 遍历menuList
                let childRoute = { // 定义一个新的子路由
                    path: '/' + menu.menuclick, // 子路由的路径
                    name: menu.menuname, // 子路由的名称
                    meta: { // 子路由的meta信息
                        title: menu.menuname // meta的标题
                    },
                    component: () => import('../components/' + menu.menucomponent) // 子路由对应的组件，使用动态导入
                };
                routeItem.children.push(childRoute) // 将新的子路由添加到/Index路由的children中
            })
        }
    })

    resetRouter() // 重置router
    router.addRoutes(routes) // 将修改后的routes添加到router中
}

export default new Vuex.Store({ // 创建一个新的Vuex.Store实例并导出
    state: { // 定义state
        menu: [] // 存储菜单数据的数组
    },
    mutations: { // 定义mutations
        setMenu(state, menuList) { // setMenu mutation，用于设置菜单数据
            state.menu = menuList; // 更新state中的menu数据

            addNewRoute(menuList) // 调用addNewRoute函数，添加新的路由
        }
    },
    getters: { // 定义getters
        getMenu(state) { // getMenu getter，用于获取菜单数据
            return state.menu // 返回state中的menu数据
        }
    }
})